<template>
  <div>
    <el-divider></el-divider>
    <el-form :model="RegisterForm" label-position="left" :rules="rules" ref="RegisterForm" label-width="95px"
             class="RegisterForm">
      <el-form-item label="账号：" prop="Sno">
        <el-input type="text" v-model="RegisterForm.account" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item label="密码：" prop="pwd">
        <el-input type="password" v-model="RegisterForm.pwd" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item label="姓名：" prop="name">
        <el-input type="text" v-model="RegisterForm.name" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item label="职称：" prop="technical">
        <el-input type="text" v-model="RegisterForm.technical" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item label="权限：" prop="role">
        <el-checkbox-group v-model="RegisterForm.role">
          <el-checkbox label="SuperAdmin" name="roles">超级管理员</el-checkbox>
          <el-checkbox label="Admin" name="roles">管理员</el-checkbox>
        </el-checkbox-group>
      </el-form-item>
      <el-form-item label="学校：" prop="schoolName">
        <el-select v-model="RegisterForm.schoolName" filterable placeholder="请选择">
          <el-option
              v-for="item in school"
              :key="item.key"
              :label="item.value"
              :value="item.key">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="学院：" prop="collegeName">
        <el-select v-model="RegisterForm.collegeName" filterable placeholder="请选择学院">
          <el-option
              v-for="item in college"
              :key="item.key"
              :label="item.value"
              :value="item.key">
          </el-option>
        </el-select>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import admin from "../../../api/admin";
import majorInfo from "../../../api/major";

export default {
  name: "EditAdmin",
  beforeCreate() {
  },
  mounted() {
    const row = JSON.parse(localStorage.getItem("edit"))
    this.init()
    if (row!=='')
     this.setData(row)
  },
  data() {
    // 自定义验证规则
    const checkPwd = (rules, value, callback) => {
      if (value === "") {
        callback(new Error("请再次输入密码"))
      } else if (value !== this.RegisterForm.pwd) {
        callback(new Error("两次密码不一致"))
      } else {
        callback()
      }
    }
    return {
      school: '',
      college: '',
      id: '',
      // 表单数据
      RegisterForm: {
        account: '',
        pwd: '',
        name: '',
        role: [],
        technical: '',
        schoolName: '',
        collegeName: '',
      },
      roles: [],
      // 数据验证规则
      rules: {
        account: [
          {required: true, message: '请输入账号', trigger: 'blur'},
          {max: 12, message: '账号不正确', trigger: 'blur'}
        ],
        pwd: [
          {required: true, message: '请输入密码', trigger: 'blur'},
          {min: 8, max: 20, message: '请输入8-20位密码', trigger: 'blur'}
        ],
        confirmPwd: [{validator: checkPwd, trigger: 'blur'}],
        name: [
          {required: true, message: '请输入姓名', trigger: 'blur'},
          {max: 4, message: '姓名不能大于四个字', trigger: 'blur'}
        ],
        schoolName: [
          {required: true, message: '请选择学校', trigger: 'change'},
        ],
        collegeName: [
          {required: true, message: '请输入学院', trigger: 'blur'},
        ],
        role: [
          {type: 'array', required: true, message: '请至少选择一个操作权限', trigger: 'change'}
        ],
      }
    }
  },
  methods: {
    setData(row) {
      this.RegisterForm.account = row.account
      this.RegisterForm.pwd = row.pwd
      this.RegisterForm.name = row.name
      this.RegisterForm.account = row.account
      this.RegisterForm.schoolName = row.schoolName
      this.RegisterForm.collegeName = row.collegeName
      this.RegisterForm.technical = row.technical
      this.RegisterForm.role = row.role
      this.id = row._id
    },
    init() {
      let school = []
      let college = []
      majorInfo.forEach(v => {
        school.push({
          key: v.key,
          value: v.value
        })
        v.children.forEach(c => {
          college.push({
            key: c.key,
            value: c.value
          })
        })
      })
      this.school = school
      this.college = college
    },
    // 更改用户信息
    UpdateAdminUserInfo() {
      const param = {
        id: this.id,
        formData: {...this.RegisterForm}
      }
      const loading = this.$loading({
        lock: true,
        text: '更新中请稍后...',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      });
      admin.UpdateByIdAdminUserInfo(param).then(r => {
        if (r.data.status === "200") {
          this.$message({
            showClose: true,
            message: '修改成功',
            type: 'success',
          });
          loading.close();
          this.$emit("updateOk")
        }
      }).catch(err => {
        loading.close();
        this.$message({
          showClose: true,
          message: '更新失败' + err,
          type: 'error'
        });
      })
    }
  }
}
</script>

<style scoped>

.RegisterForm /deep/ .el-form-item .el-form-item__label::before {
  content: '';
}

.RegisterForm {
  padding: 0 20px;
  margin: 0 auto;
}


</style>